@extends('wap.layouts.master')
@section('title','支付')

@section('content')

<div class="aw-main aw-booking-pay">
	<!--已选场次-开始微信：@{{wx_pay_config}}-->
	<div class="aw-mt20 aw-bg-fff aw-assest-field-selected">
		<div class="aw-field-selected-title">已选场次</div>
		<ul class="aw-field-selected-list">
			<li class="aw-field-selected-li">
				<div class="aw-field-selected-adds">@{{info_selected.storefront_name}}<span class="aw-color-666">&nbsp;&nbsp;@{{info_selected.type_text}} (@{{info_selected.number}}号)</span></div>
				<div class="aw-field-selected-time">@{{info_selected.date_info.year}}年@{{info_selected.date_info.month}}月@{{info_selected.date_info.day}}日 @{{info_selected.start_time}}-@{{info_selected.end_time}} @{{info_selected.date_info.week}}</div>
				<div class="aw-color-2 aw-field-selected-money">@{{info_selected.price}}</div>
			</li>
		</ul>
	</div>
	<!--已选场次-结束返回：-->
	<!--优惠券&&会员打折-开始订单post：@{{Get_order}}-->
	<ul class="aw-assest-form aw-bg-fff aw-mt10 aw-pay-user">
		<li class="aw-form-li">
			<div class="aw-left">
				优惠券
			</div>
			<div class="aw-conter">
				<select class="select-none" id="coupon_key" :value="form.coupon_key" v-model="form.coupon_key">
					<option v-if="coupon_list_length==0" value="-1">暂无可用</option>
					<option v-if="coupon_list_length!=0" value="-2">不使用优惠券</option>
					<option v-for="(list,key) in coupon_list" :value="key" :data-coupon_id="list.id">@{{list.name}} @{{list.money}}</option>
				</select>
			</div>
			<div class="aw-icon aw-icon-more aw-right"></div>
		</li>
		<li class="aw-form-li">
			<div class="aw-left">
				会员打折
			</div>
			<div class="aw-conter">
				<div class="select-none aw-text-right aw-pr20 aw-color-FE2D2A" v-if="!info_discount.discount">
					暂无折扣
				</div>
				<div class="select-none aw-text-right aw-pr20 aw-color-FE2D2A" v-else>
					@{{info_discount.vip}} @{{info_discount.discount}} 折
				</div>
			</div>
			<div class="aw-icon aw-icon-more aw-right"></div>
		</li>
		<li class="aw-form-li aw-border-none">
			<div class="aw-conter aw-text-right">
				小计<span class="aw-color-2 aw-bold">￥@{{form.price}}</span>
			</div>
		</li>
	</ul>
	<!--优惠券&&会员打折-结束thisform：@{{form}}-->
	<!--1订场 2应战 3约战-->
	<div class="aw-pay-text" v-if="info_selected.order_type==1">应战成功后订单不可取消。</div>
	<div class="aw-pay-text" v-if="info_selected.order_type==2">未匹配成功的约战订单可以在我的订单中随时取消，一旦匹配成功不可取消。</div>
	<div class="aw-pay-text" v-if="info_selected.order_type==3">开赛时间72小时前可以在我的订单中取消订单。</div>
</div>
<div class="aw-bg-191E1C aw-foot-btn aw-foot-btn1">
	合计：<span class="aw-color-2">￥@{{form.price}}</span>
	<button type="submit" class="aw-assest-btn aw-btn-bgcolor-lvse" v-on:click="Submit_Pay()">确认支付</button>
</div>

@section('pagejs')
@parent

<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script type="text/javascript">
//获取缓存选中的场次
var GBC_Selected=Get_Browser_Cache('info_order');
var MJS_User_Info=GBC_User_Info;
if(!GBC_Selected){
	window.history.back();
}
var Vue_Data={
	res:{},
	wx_pay_config:{},
	coupon_list:{},
	coupon_list_length:0,
	info_discount:{},
	info_selected:GBC_Selected,
	form:{coupon_price:0,price:GBC_Selected.price,coupon_id:'',coupon_key:-1,},
}
//获取优惠信息
var AD_discount={
	api:'/api/order/discount',
	form_data:{page_num:100,price:GBC_Selected.price},
	tips:false,
}
getData(AD_discount,function(ajax_data){
	Vue_Data.coupon_list=ajax_data.coupon_list;
	console.log(ajax_data.coupon_list.length)
	if(ajax_data.coupon_list.length>0){
		Vue_Data.coupon_list_length=1;
		Vue_Data.form.coupon_key=-2;
		Vue_Data.form.coupon_id=ajax_data.coupon_list[0].coupon_id;
		Vue_Data.form.coupon_price=ajax_data.coupon_list[0].money;
	}
	Vue_Data.info_discount={
		vip:ajax_data.vip,discount:ajax_data.discount,
	}
})
//创建订单
var Team_info=GBC_Selected.team_info;
//订场
var Get_order={
	field_id:GBC_Selected.field_id,
	type:GBC_Selected.type,
	day:GBC_Selected.day,
	start_time:GBC_Selected.start_time,
	end_time:GBC_Selected.end_time,
	coupon_id:GBC_Selected.coupon_id,
	order_type:GBC_Selected.order_type,
}
if(GBC_Selected.order_type!=3){
	//约战
	var Get_order_match={
		team_id:Team_info.team_id,
		people_number:Team_info.people_number,
		avg_age:Team_info.avg_age,
		colour:Team_info.colour,
		desc:Team_info.desc
	}
	if(GBC_Selected.order_type==2){
		//应战
		Get_order_match.invite_id=GBC_Selected.invite_id;
	}
	$.extend(Get_order,Get_order_match)
}
console.log(1111)
console.log(Get_order)
var AD_order={
	api:'/api/order/create-order',
	form_data:Get_order,
	tips:false,
}
Vue_Data.Get_order=Get_order;
var is_pay=0;
vm=new Vue({
	el:'#Vue-body',
	data:Vue_Data,
	methods:{
		End_Price:function(){
			var price=this.info_selected.price;
			var coupon_price=this.form.coupon_price;
			var discount=this.info_discount.discount;
			if(!discount){
				discount=10;
			}
			var this_discount=discount*0.1;
			var end_price=(price-coupon_price)*this_discount;
			if(end_price<0){
				end_price=0;
			}
			this.form.price=end_price.toFixed(2);
		},Submit_Pay:function(){
        	this.form.coupon_id=$('#coupon_key option:selected').attr('data-coupon_id');
			$.extend(AD_order.form_data,this.form);
			$.extend(this.Get_order,AD_order.form_data);
			$.extend(AD_order.form_data,this.Get_order);
			console.log('AD_order')
			console.log(AD_order)
			var info=GBC_Selected.msg;
			if(MJS_User_Info.status==2){
				msgTips('账户被禁用,请联系管理员',1)
				return;
			}
			if(is_pay){return;}
			is_pay=1;
			var order_type=AD_order.form_data.order_type;
			$.post(AD_order.api,AD_order.form_data,function(res){
				console.log(res)
				vm.res=res;
				var msg=res.msg;
	            if(res.code!=1){
	                msgTips(msg)
	                return;
	            }
	            var data=res.data;
	            var wx_pay_config=data.wx_pay_config;
	            var wx_pay_config={
	            	appId:wx_pay_config.appId,     //公众号名称，由商户传入
			    	timeStamp:wx_pay_config.timestamp+'',         //时间戳，自1970年以来的秒数
			    	nonceStr:wx_pay_config.nonceStr, //随机串
			    	package:wx_pay_config.package,
			    	signType:wx_pay_config.signType,         //微信签名方式：
			        paySign:wx_pay_config.paySign //微信签名
	            }
	            vm.res=data;
	            vm.wx_pay_config=wx_pay_config;
				WeixinJSBridge.invoke(
			       'getBrandWCPayRequest',wx_pay_config,function(res){
						if(res.err_msg == "get_brand_wcpay_request:ok"){
							is_pay=0;
							Del_Browser_Cache('info_order');
			           		location.href='/wap/common/msg?state=1&order_type='+order_type;
			       		}else{
			       			is_pay=0;
			       			location.href='/wap/common/msg?state=2&order_type='+order_type;
			       		}//使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回    ok，但并不保证它绝对可靠。
			    	}
				)
	        });
		}
	},watch:{
        'form.coupon_key':function(key,olval){
        	console.log('key')
        	console.log(key,olval)
        	if(key==-2){
        		this.form.coupon_id=-2;
        		this.form.coupon_price=0;
        		this.End_Price()
        		return;
        	}
        	var Info_Coupon=this.coupon_list[key];
        	this.form.coupon_id=Info_Coupon.coupon_id;
        	this.form.coupon_price=Info_Coupon.money;
        	this.End_Price()
        }
    }
})
setTimeout(function(){
	for(var i=0;i<vm.coupon_list.length;i++){
		var status=vm.coupon_list[i].status;
		console.log(33333333)
		console.log(status)
		if(status=='disabled'){
			$('#coupon_key option[value="'+i+'"]').attr('disabled','')
		}
	}
	vm.End_Price()
},800)
</script>
@endsection

@endsection

